<template>
  <div v-loading.fullscreen="loading">

    <el-dialog
      v-model="dialogDatas.dialogFormVisible"
      :title="dialogDatas.isNew ? '添加':'修改'"
      top="5vh"
    >
      <el-scrollbar max-height="70vh">
        <el-form :model="dialogDatas.currentData">
          <el-form-item
            v-for="item in dialogDatas.formItems"
            :label="item.label"
          >
            <el-date-picker
              v-if="item.isDate"
              v-model="dialogDatas.currentData[item.value]"
              :type="item.dateOption ? item.dateOption.type : 'date'"
              :format="item.dateOption ? item.dateOption.format : 'YYYY/MM/DD'"
              :value-format="item.dateOption ? item.dateOption.valueFormat : 'YYYY/MM/DD'"
              :date-format="item.dateOption ? item.dateOption.dateFormat : ''"
              :time-format="item.dateOption ? item.dateOption.timeFormat : ''"
            />
            <el-switch
              v-else-if="item.isSwitch"
              v-model="dialogDatas.currentData[item.value]"
              inline-prompt
              active-text="启用"
              inactive-text="不启用"
              :active-value="item.trueValue"
              :inactive-value="item.falseValue"
            />

            <el-radio-group
              v-else-if="item.isRadio"
              v-model="dialogDatas.currentData[item.value]"
            >
              <el-radio
                v-for="radio in item.radioOptions"
                :value="radio.value"
                :label="radio.label"
              >
              </el-radio>
            </el-radio-group>

            <el-input
              v-else
              v-model="dialogDatas.currentData[item.value]"
            />
          </el-form-item>
        </el-form>
      </el-scrollbar>

      <template #footer>
        <span>
          <el-button @click="dialogDatas.dialogFormVisible = false">取消</el-button>
          <el-button
            type="primary"
            @click="dialogDatas.confirmBtnClick"
          >
            确定
          </el-button>
        </span>
      </template>
    </el-dialog>

    <el-collapse v-model="activeName">

      <el-collapse-item name="1">
        <template #title>
          <span style="color:red">未审批</span>
        </template>

        <el-row :gutter="10">
          <el-col
            :span="12"
            style="text-align:left"
          >
            <el-button
              type="success"
              @click="tableDatas.exportBtnClick(3)"
            >导出未录入</el-button>
            <el-button
              type="primary"
              @click="tableDatas.exportBtnClick()"
            >导出全部</el-button>
          </el-col>
          <el-col
            :span="12"
            style="text-align:left"
          >
          </el-col>
          <!-- <el-input v-model="tableDatas.filters.userid"></el-input> -->
        </el-row>
        <el-table
          class="marginTop10"
          :data="tableDatas.tableDatasAfterPage"
          stripe
          border
          empty-text="无数据"
          max-height="75vh"
        >
          <el-table-column
            v-for="column in tableDatas.tableColumns"
            :prop="column.prop"
            :label="column.label"
            :align="column.align"
            :width="column.width"
            :formatter="column.formatter"
          >
            <template
              #default="scope"
              v-if="column.prop =='TYPE'"
            >
              <div>
                <el-tag
                  v-if="scope.row.TYPE == 0"
                  type="primary"
                  size="large"
                >内部车辆</el-tag>
                <el-tag
                  v-if="scope.row.TYPE == 1"
                  :type="scope.row.DATA8 =='集团内部' ? 'success':'warning'"
                  size="large"
                >{{ scope.row.DATA8 =='集团内部' ?'集团内部':'外部车辆' }}</el-tag>
              </div>
            </template>

            <template
              #default="scope"
              v-else-if="column.prop =='DATA7'"
            >
              <div :style="{color: scope.row.DATA7 ? 'red':'black'}">
                {{ scope.row.DATA7}}
              </div>
            </template>

            <template
              #default="scope"
              v-else-if="column.prop =='PASSDATE'"
            >
              <div v-if="scope.row.PASSDATE">
                <div>开始日期:{{ scope.row.PASSDATE.split(',')[0] }}</div>
                <div>结束日期:{{ scope.row.PASSDATE.split(',')[1] }}</div>
              </div>
            </template>

            <template
              #default="scope"
              v-else-if="column.prop =='operate'"
            >
              <div>
                <el-popconfirm
                  confirm-button-text="确定"
                  cancel-button-text="取消"
                  title="确定通过?审批人对员工提交的车辆信息真实性负责，如有员工伪造车辆信息进入公司并造成损失，审核领导负连带责任。"
                  @confirm="tableDatas.editBtnClick(scope.row)"
                  v-if="['0','1'].includes(scope.row.STATE) && !['0120'].includes(tableDatas.filters.userid)"
                >
                  <template #reference>
                    <el-button type="success">通过</el-button>
                  </template>
                </el-popconfirm>

                <el-popconfirm
                  confirm-button-text="确定"
                  cancel-button-text="取消"
                  title="确定通过?审批人对员工提交的车辆信息真实性负责，如有员工伪造车辆信息进入公司并造成损失，审核领导负连带责任。"
                  @confirm="tableDatas.editBtnClick(scope.row,3)"
                  v-if="['0','1','2'].includes(scope.row.STATE) && ['0120'].includes(tableDatas.filters.userid)"
                >
                  <template #reference>
                    <el-button type="primary">提交</el-button>
                  </template>
                </el-popconfirm>

                <el-button
                  :type="scope.row.STATE == '-2'? 'danger':'success'"
                  v-if="['-2','3'].includes(scope.row.STATE) && ['6022','15081'].includes(tableDatas.filters.userid)"
                  @click="tableDatas.editBtnClick(scope.row,scope.row.STATE == '-2' ? -3:4)"
                >{{ scope.row.STATE == '-2' ?'确认删除完成':'确认录入完成'}}</el-button>

                <el-button
                  type="danger"
                  @click="tableDatas.returnBtnClick(scope.row,-1)"
                >退回</el-button>
                <!-- <el-popconfirm
              confirm-button-text="确定"
              cancel-button-text="取消"
              title="确定删除该条记录?"
              @confirm="tableDatas.deleteBtnClick(scope.row)"
            >
              <template #reference>
                <el-button type="danger">删除</el-button>
              </template>
            </el-popconfirm> -->
              </div>
            </template>

            <!-- <template
          #default="scope"
          v-else-if="column.prop =='STATE'"
        >
          <div>
            <el-tag
              v-if="scope.row.STATE == '-1'"
              type="danger"
              size="large"
            >审批未通过</el-tag>
            <el-tag
              v-if="['0','1','2'].includes(scope.row.STATE)"
              type="primary"
              size="large"
            >审批中</el-tag>
            <el-tag
              v-if="scope.row.STATE == '3'"
              type="success"
              size="large"
            >审批已通过</el-tag>
          </div>
        </template> -->

          </el-table-column>
        </el-table>

        <el-pagination
          class="marginTop10"
          @size-change="tableDatas.filters.handleSizeChange"
          @current-change="tableDatas.filters.handleCurrentChange"
          :page-sizes="[10, 15, 20, 100]"
          :page-size="tableDatas.filters.pagesize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="tableDatas.tableDatasAfterFilter.length"
        >
        </el-pagination>
      </el-collapse-item>

      <el-collapse-item name="2">

        <template #title>
          <span style="color:green">已审批</span>
        </template>

        <el-table
          class="marginTop10"
          :data="tableDatas.tableDatasAfterPage2"
          stripe
          border
          empty-text="无数据"
          max-height="75vh"
        >
          <el-table-column
            v-for="column in tableDatas.tableColumns2"
            :prop="column.prop"
            :label="column.label"
            :align="column.align"
            :width="column.width"
            :formatter="column.formatter"
          >
            <template
              #default="scope"
              v-if="column.prop =='TYPE'"
            >
              <div>
                <el-tag
                  v-if="scope.row.TYPE == 0"
                  type="primary"
                  size="large"
                >内部车辆</el-tag>
                <el-tag
                  v-if="scope.row.TYPE == 1"
                  :type="scope.row.DATA8 =='集团内部' ? 'success':'warning'"
                  size="large"
                >{{ scope.row.DATA8 =='集团内部' ?'集团内部':'外部车辆' }}</el-tag>
              </div>
            </template>

            <template
              #default="scope"
              v-else-if="column.prop =='DATA7'"
            >
              <div :style="{color: scope.row.DATA7 ? 'red':'black'}">
                {{ scope.row.DATA7}}
              </div>
            </template>

            <template
              #default="scope"
              v-else-if="column.prop =='PASSDATE'"
            >
              <div v-if="scope.row.PASSDATE">
                <div>开始日期:{{ scope.row.PASSDATE.split(',')[0] }}</div>
                <div>结束日期:{{ scope.row.PASSDATE.split(',')[1] }}</div>
              </div>
            </template>

            <template
              #default="scope"
              v-else-if="column.prop =='STATE'"
            >
              <div>
                <el-tag
                  v-if="scope.row.STATE == '-3'"
                  type="danger"
                  size="large"
                >已删除</el-tag>
                <el-tag
                  v-if="scope.row.STATE == '-2'"
                  type="danger"
                  size="large"
                >申请删除</el-tag>
                <el-tag
                  v-if="scope.row.STATE == '-1'"
                  type="danger"
                  size="large"
                >审批未通过</el-tag>
                <el-tag
                  v-if="['0','1','2','3'].includes(scope.row.STATE)"
                  type="primary"
                  size="large"
                >审批中</el-tag>
                <el-tag
                  v-if="scope.row.STATE == '4'"
                  type="success"
                  size="large"
                >已录入</el-tag>
              </div>
            </template>

          </el-table-column>
        </el-table>

        <el-pagination
          class="marginTop10"
          @size-change="tableDatas.filters2.handleSizeChange"
          @current-change="tableDatas.filters2.handleCurrentChange"
          :page-sizes="[10, 15, 20, 100]"
          :page-size="tableDatas.filters2.pagesize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="tableDatas.tableDatasAfterFilter2.length"
        >
        </el-pagination>
      </el-collapse-item>

    </el-collapse>

  </div>
</template>
<script>
import { computed, reactive, ref } from 'vue';
import { onMounted, watch } from '@vue/runtime-core';
import myAxios from '@/myAxios/myAxios';
import { showWarning } from '@/hooks/useMyMessageBox';
import { v4 } from 'uuid';
import { dayjs } from 'element-plus';
import store from '@/store';
import VueCookie from 'vue-cookie';
import { useRouter } from 'vue-router';
import useMyXlsx from '@/hooks/useMyXlsx';

export default {
  name: 'CheckCarsView',
  setup () {
    let activeName = reactive(['1']);
    let loading = ref(false);
    let addBtnClick = function () {
      showFormDialog();
    };

    let showFormDialog = function (row) {
      if (row) {
        dialogDatas.isNew = false;
        dialogDatas.currentData = { ...row };
      }
      else {
        dialogDatas.isNew = true;
        dialogDatas.currentData = {};
      }
      dialogDatas.dialogFormVisible = true;
    };

    let dialogDatas = reactive({
      dialogFormVisible: false,
      currentData: {},
      isNew: false,
      formItems: [
        // {
        //   "value": "APPLY_ID",
        //   "label": "ID",
        //   "isDate": false,
        // },
        {
          "value": "USERID",
          "label": "申请人ID",
          "isDate": false,
        },
        {
          "value": "USERNAME",
          "label": "申请人姓名",
          "isDate": false,
          "formatter": (row) => {
            // 如果是外部申请,在申请人姓名上加外部字样
            if (row.TYPE == '1') {
              // 如果是外包的申请,在申请人姓名上加外包字样
              if (row.DATA8 == '外包') {
                return `${row.USERNAME}(外部)(外包)`;
              }
              // 如果是集团内部的申请,在申请人姓名上加集团内部字样
              if (row.DATA8 == '集团内部') {
                return `${row.USERNAME}(外部)(集团内部)`;
              }
              else {
                return `${row.USERNAME}(外部)`;
              }
            }
            // 如果是内部申请,在申请人姓名上加ID
            else if (row.TYPE == '0') {
              return `${row.USERNAME}(${row.USERID})`;
            }
          },
        },
        {
          "value": "SP_USERID",
          "label": "审批人ID",
          "isDate": false,
        },
        {
          "value": "SP_USERNAME",
          "label": "审批人姓名",
          "isDate": false,
        },
        // {
        //   "value": "TYPE",
        //   "label": "类型 0:内部审批 1 外部审批",
        //   "isDate": false,
        // },
        // {
        //   "value": "CREATETIME",
        //   "label": "创建时间",
        //   "isDate": false,
        // },
        // {
        //   "value": "PASSTIME",
        //   "label": "审批通过时间",
        //   "isDate": false,
        // },
        // {
        //   "value": "STATE",
        //   "label": "状态 0:待审批 1:审批通过 2:审批未通过",
        //   "isDate": false,
        // },
        // {
        //   "value": "REASON",
        //   "label": "访问原因",
        //   "isDate": false,
        // },
        // {
        //   "value": "PASSDATE",
        //   "label": "外部访客访问时间",
        //   "isDate": false,
        // },
        {
          "value": "CARID",
          "label": "车牌号",
          "isDate": false,
        },
        // {
        //   "value": "DATA1",
        //   "label": "DATA1",
        //   "isDate": false,
        // },
        // {
        //   "value": "DATA2",
        //   "label": "DATA2",
        //   "isDate": false,
        // },
        // {
        //   "value": "DATA3",
        //   "label": "DATA3",
        //   "isDate": false,
        // },
        // {
        //   "value": "DATA4",
        //   "label": "DATA4",
        //   "isDate": false,
        // },
      ],
      checkCurrentData: function () {
        let userid = dialogDatas.currentData.USERID ? dialogDatas.currentData.USERID : '';
        let sp_userid = dialogDatas.currentData.SP_USERID ? dialogDatas.currentData.SP_USERID : '';
        let carid = dialogDatas.currentData.CARID ? dialogDatas.currentData.CARID : '';
        if (!userid) {
          showWarning('申请人工号不能为空');
          return false;
        }
        if (!sp_userid) {
          showWarning('审批人工号不能为空');
          return false;
        }
        if (!carid) {
          showWarning('车牌号不能为空');
          return false;
        }
        return true;
      },
      confirmBtnClick: function () {
        let isPassCheck = dialogDatas.checkCurrentData();
        if (!isPassCheck) {
          return;
        }

        loading.value = true;

        let uuid = dialogDatas.currentData.APPLY_ID ? dialogDatas.currentData.APPLY_ID : v4();
        let userid = dialogDatas.currentData.USERID;
        let username = dialogDatas.currentData.USERNAME;
        let sp_userid = dialogDatas.currentData.SP_USERID;
        let sp_username = dialogDatas.currentData.SP_USERNAME;
        let type = 0;
        let createtime = dialogDatas.currentData.CREATETIME ? dialogDatas.currentData.CREATETIME : dayjs().format('YYYY/MM/DD HH:mm:ss');
        let passtime = dialogDatas.currentData.PASSTIME ? dialogDatas.currentData.PASSTIME : '';
        let state = 0;
        let reason = '';
        let passdate = '';
        let carid = dialogDatas.currentData.CARID;
        let data1 = '';
        let data2 = '';
        let data3 = '';
        let data4 = '';

        let params = `${uuid}\t${userid}\t${username}\t${sp_userid}` +
          `\t${sp_username}\t${type}\t${createtime}\t${passtime}` +
          `\t${state}\t${reason}\t${passdate}\t${carid}` +
          `\t${data1}\t${data2}\t${data3}\t${data4}`;

        myAxios.post('陈帅廷添加或修改驱动访客系统记录', params).then(res => {
          if (res.includes('成功')) {
            loading.value = false;
            dialogDatas.dialogFormVisible = false;
            ElMessage({
              showClose: true,
              type: 'success',
              message: '提交成功!' + res
            });
            getTableDatas();
          }
          else {
            loading.value = false;
            showWarning('更新失败res!' + res);
          }
        }).catch((err) => {
          loading.value = false;
          showWarning('更新失败err!' + err);
        });

      },
      cancelBtnClick: function () {

      }
    });

    let getTableDatas = async function () {
      loading.value = true;

      //一级审批
      let params0 = `SP_USERID\t${tableDatas.filters.userid}\t0`;
      let res0 = await myAxios.get('陈帅廷查询驱动访客系统审批人未审批记录', params0);
      //二级审批
      let params1 = `DATA1\t${tableDatas.filters.userid}\t1`;
      let res1 = await myAxios.get('陈帅廷查询驱动访客系统审批人未审批记录', params1);
      //三级审批
      let params2 = `DATA2\t${tableDatas.filters.userid}\t2`;
      let res2 = await myAxios.get('陈帅廷查询驱动访客系统审批人未审批记录', params2);

      if (res0 instanceof Array) {
        loading.value = false;
        if (['6022', '15081'].includes(tableDatas.filters.userid)) {
          //三级审批完成
          let params3 = `STATE\t3\t3`;
          let res3 = await myAxios.get('陈帅廷查询驱动访客系统审批人未审批记录', params3);
          //已删除
          let params4 = `STATE\t-2\t-2`;
          let res4 = await myAxios.get('陈帅廷查询驱动访客系统审批人未审批记录', params4);

          tableDatas.oritableData = [...res3, ...res4];

          //汪永光录入完成
          let params5 = `STATE\t4\t4`;
          let res5 = await myAxios.get('陈帅廷查询驱动访客系统审批人未审批记录', params5);
          //汪永光删除完成
          let params6 = `STATE\t-3\t-3`;
          let res6 = await myAxios.get('陈帅廷查询驱动访客系统审批人未审批记录', params6);

          let wygResult = [...res5, ...res6];
          // 按照PASSTIME排序
          wygResult.sort((a, b) => {
            // 如果是空的,设为空字符串
            a.PASSTIME = a.PASSTIME ? a.PASSTIME : '';
            b.PASSTIME = b.PASSTIME ? b.PASSTIME : '';

            return a.PASSTIME > b.PASSTIME ? -1 : 1;
          });
          console.log('object :>> ', wygResult);
          tableDatas.oritableData2 = wygResult;
        }
        else {
          tableDatas.oritableData = [...res0, ...res1, ...res2,];

          let params7 = `${tableDatas.filters.userid}`;
          let res7 = await myAxios.get('陈帅廷查询驱动访客系统审批人相关记录', params7);
          let wygResult = [...res7];
          // 按照PASSTIME排序
          wygResult.sort((a, b) => {
            // 如果是空的,设为空字符串
            a.PASSTIME = a.PASSTIME ? a.PASSTIME : '';
            b.PASSTIME = b.PASSTIME ? b.PASSTIME : '';

            return a.PASSTIME > b.PASSTIME ? 1 : -1;
          });
          tableDatas.oritableData2.push(...wygResult);
        }
        // ElMessage({
        //   showClose: true,
        //   type: 'success',
        //   message: '最新数据获取成功!',
        // });
      }
      else {
        loading.value = false;
        showWarning('获取数据失败res!' + res0);
      }
    };

    onMounted(() => {
      getTableDatas();
    });

    let router = useRouter();
    let tableDatas = reactive({
      //表格筛选展示相关代码
      filters: {
        // userid: '0120',
        userid: VueCookie.get('userid'),

        //表格翻页相关代码
        currentPage: 1,
        pagesize: 10,
        handleSizeChange (val) {
          tableDatas.filters.pagesize = val;
        },
        handleCurrentChange (val) {
          tableDatas.filters.currentPage = val;
        },
      },
      filters2: {
        // userid: '0120',
        userid: VueCookie.get('userid'),

        //表格翻页相关代码
        currentPage: 1,
        pagesize: 10,
        handleSizeChange (val) {
          tableDatas.filters2.pagesize = val;
        },
        handleCurrentChange (val) {
          tableDatas.filters2.currentPage = val;
        },
      },
      tableDatasAfterFilter: computed(() => {
        let fData = tableDatas.oritableData;
        return fData;
      }),
      tableDatasAfterFilter2: computed(() => {
        let fData = tableDatas.oritableData2;
        return fData;
      }),
      tableDatasAfterPage: computed(() => {
        let fData = tableDatas.tableDatasAfterFilter;
        fData = fData.slice((tableDatas.filters.currentPage - 1) * tableDatas.filters.pagesize, tableDatas.filters.currentPage * tableDatas.filters.pagesize);
        return fData;
      }),
      tableDatasAfterPage2: computed(() => {
        let fData = tableDatas.tableDatasAfterFilter2;
        fData = fData.slice((tableDatas.filters2.currentPage - 1) * tableDatas.filters2.pagesize, tableDatas.filters2.currentPage * tableDatas.filters2.pagesize);
        return fData;
      }),

      tableColumns: [
        // {
        //   "prop": "APPLY_ID",
        //   "label": "ID",
        //   "align": "center",
        // },
        {
          "prop": "USERID",
          "label": "申请人ID",
          "align": "center"
        },
        {
          "prop": "USERNAME",
          "label": "申请人姓名",
          "align": "center",
          "formatter": (row) => {

            if (row['DATA10']) {
              return (row['DATA10'] + row['USERNAME']);
            }
            else {
              return (row['USERID'] + row['USERNAME']);
            }
          },
        },
        // {
        //   "prop": "SP_USERID",
        //   "label": "审批人ID",
        //   "align": "center"
        // },
        // {
        //   "prop": "SP_USERNAME",
        //   "label": "审批人姓名",
        //   "align": "center"
        // },
        {
          "prop": "TYPE",
          "label": "类型",
          "align": "center",
        },
        {
          "prop": "CREATETIME",
          "label": "创建时间",
          "align": "center"
        },
        // {
        //   "prop": "PASSTIME",
        //   "label": "审批通过时间",
        //   "align": "center"
        // },
        // {
        //   "prop": "STATE",
        //   "label": "状态",
        //   "align": "center",
        // },
        {
          "prop": "REASON",
          "label": "访问原因",
          "align": "center",
        },
        {
          "prop": "PASSDATE",
          "label": "访问时间",
          "align": "center",
          "formatter": (row) => {
            // 如果是外部申请
            if (row.TYPE == '1') {
              return row.PASSDATE;
            }
            // 如果是内部申请,显示长期
            else if (row.TYPE == '0') {
              return '长期';
            }
          },
        },
        {
          "prop": "DATA7",
          "label": "旧车牌",
          "align": "center",
          "width": 100,
        },
        {
          "prop": "CARID",
          "label": "车牌号",
          "align": "center",
          "width": 100,
        },
        // {
        //   "prop": "DATA1",
        //   "label": "DATA1",
        //   "align": "center",
        // },
        // {
        //   "prop": "DATA2",
        //   "label": "DATA2",
        //   "align": "center",
        // },
        {
          "prop": "DATA3",
          "label": "车牌颜色",
          "align": "center",
          "width": 100,
        },
        {
          "prop": "DATA4",
          "label": "车辆颜色",
          "align": "center",
          "width": 100,
        },
        {
          "prop": "DATA5",
          "label": "车辆品牌",
          "align": "center",
        },
        {
          "prop": "DATA6",
          "label": "手机号码",
          "align": "center",
        },

        // {
        //   "prop": "DATA8",
        //   "label": "DATA8",
        //   "align": "center",
        // },
        // {
        //   "prop": "DATA9",
        //   "label": "DATA9",
        //   "align": "center",
        // },
        // {
        //   "prop": "DATA10",
        //   "label": "DATA10",
        //   "align": "center",
        // },

        {
          "prop": "operate",
          "label": "操作",
          "align": "center",
          "width": 220,
        }
      ],
      tableColumns2: [
        // {
        //   "prop": "APPLY_ID",
        //   "label": "ID",
        //   "align": "center",
        // },
        {
          "prop": "USERID",
          "label": "申请人ID",
          "align": "center"
        },
        {
          "prop": "USERNAME",
          "label": "申请人姓名",
          "align": "center",
          "formatter": (row) => {

            if (row['DATA10']) {
              return (row['DATA10'] + row['USERNAME']);
            }
            else {
              return (row['USERID'] + row['USERNAME']);
            }
          },
        },
        // {
        //   "prop": "SP_USERID",
        //   "label": "审批人ID",
        //   "align": "center"
        // },
        // {
        //   "prop": "SP_USERNAME",
        //   "label": "审批人姓名",
        //   "align": "center"
        // },
        {
          "prop": "TYPE",
          "label": "类型",
          "align": "center",
        },
        {
          "prop": "CREATETIME",
          "label": "创建时间",
          "align": "center"
        },
        {
          "prop": "PASSTIME",
          "label": "审批通过时间",
          "align": "center"
        },
        {
          "prop": "STATE",
          "label": "状态",
          "align": "center",
        },
        {
          "prop": "REASON",
          "label": "访问原因",
          "align": "center",
        },
        {
          "prop": "PASSDATE",
          "label": "访问时间",
          "align": "center",
          "formatter": (row) => {
            // 如果是外部申请
            if (row.TYPE == '1') {
              return row.PASSDATE;
            }
            // 如果是内部申请,显示长期
            else if (row.TYPE == '0') {
              return '长期';
            }
          },
        },
        {
          "prop": "DATA7",
          "label": "旧车牌",
          "align": "center",
          "width": 100,
        },
        {
          "prop": "CARID",
          "label": "车牌号",
          "align": "center",
          "width": 100,
        },
        // {
        //   "prop": "DATA1",
        //   "label": "DATA1",
        //   "align": "center",
        // },
        // {
        //   "prop": "DATA2",
        //   "label": "DATA2",
        //   "align": "center",
        // },
        {
          "prop": "DATA3",
          "label": "车牌颜色",
          "align": "center",
          "width": 100,
        },
        {
          "prop": "DATA4",
          "label": "车辆颜色",
          "align": "center",
          "width": 100,
        },
        {
          "prop": "DATA5",
          "label": "车辆品牌",
          "align": "center",
        },
        {
          "prop": "DATA6",
          "label": "手机号码",
          "align": "center",
        },

        // {
        //   "prop": "DATA8",
        //   "label": "DATA8",
        //   "align": "center",
        // },
        // {
        //   "prop": "DATA9",
        //   "label": "DATA9",
        //   "align": "center",
        // },
        // {
        //   "prop": "DATA10",
        //   "label": "DATA10",
        //   "align": "center",
        // },

        // {
        //   "prop": "operate",
        //   "label": "操作",
        //   "align": "center",
        //   "width": 170,
        // },
      ],
      oritableData: [],
      oritableData2: [],
      returnBtnClick: function (row, state) {
        // 弹框输入退回原因
        ElMessageBox.prompt('请输入退回原因', 'Tip', {
          confirmButtonText: 'OK',
          cancelButtonText: 'Cancel',
          inputPattern: /\S/,
          inputErrorMessage: '退回原因不能为空',
        }).then(({ value }) => {
          tableDatas.editBtnClick(row, state, value);
        }).catch(() => {

          ElMessage({
            type: 'info',
            message: '已取消',
            showClose: true,
          });
        });
      },
      editBtnClick: function (row, state, returnText) {

        loading.value = true;
        if (!state) {
          // 未审批状态
          if (row.STATE == '0') {
            // 如果一级审批人和二级审批人相同
            if (row.SP_USERID == row.DATA1) {
              // 如果是内部人员变成2(盛俊审批),外部人员变成3(汪工录入)
              if (row.TYPE == '0') {
                //如果审批人是盛俊,直接给到汪工
                if (row.SP_USERID == '0120') {
                  state = 3;
                }
                else {
                  state = 2;
                }
              }
              else if (row.TYPE == '1') {
                state = 3;
              }
            }
            else {
              state = 1;
            }
          }
          // 一级审批通过状态
          else if (row.STATE == '1') {
            // 内部人员变成2(盛俊审批),外部人员变成3(汪工录入)
            if (row.TYPE == '0') {
              state = 2;
            }
            else if (row.TYPE == '1') {
              state = 3;
            }
          }
        }
        let passtime = dayjs().format('YYYY/MM/DD HH:mm:ss');
        //汪工确认删除的时候不去更新通过时间
        if (state == -3) {
          passtime = row.PASSTIME;
        }

        let params = `${row.APPLY_ID}\t${state}\t${passtime}\t${returnText}`;
        myAxios.post('陈帅廷更新驱动访客系统状态和通过时间', params).then(res => {
          if (res.includes('成功')) {
            loading.value = false;
            // dialogDatas.dialogFormVisible = false;
            ElMessage({
              showClose: true,
              type: 'success',
              message: '更新成功!' + res
            });

            if (state == 1) {
              sendTaskcard(row.DATA1);
            }
            else if (state == 2) {
              sendTaskcard(row.DATA2);
            }
            else if (state == 3) {
              sendTaskcard('6022|15081');
            }
            else if (state == 4) {
              //内部的企业微信推送,外部不管
              if (row.TYPE == 0) {
                if (row.state == -2) {
                  myAxios.postToWeChatText(row.USERID, '车辆删除失败', '您的删除车辆请求被退回,请联系6022或15081',);
                }
                else {
                  myAxios.postToWeChatText(row.USERID, '车辆登记成功', '您的车辆信息已录入',);
                }
              }
            }

            tableDatas.oritableData.splice(tableDatas.oritableData.indexOf(row), 1);
          }
          else {
            loading.value = false;
            showWarning('更新失败res!' + res);
          }
        }).catch((err) => {
          loading.value = false;
          showWarning('更新失败err!' + err);
        });

      },
      deleteBtnClick: function (row) {
        loading.value = true;

        let params = `${row.APPLY_ID}`;
        myAxios.post('陈帅廷删除驱动访客系统记录', params).then(res => {
          if (res.includes('成功')) {
            loading.value = false;
            dialogDatas.dialogFormVisible = false;
            ElMessage({
              showClose: true,
              type: 'success',
              message: '删除成功!' + res
            });
            tableDatas.oritableData.splice(tableDatas.oritableData.indexOf(row), 1);
          }
          else {
            loading.value = false;
            showWarning('删除失败res!' + res);
          }
        }).catch((err) => {
          loading.value = false;
          showWarning('删除失败err!' + err);
        });

      },

      exportBtnClick: function (state) {
        let xlsx = useMyXlsx();
        let titles = {
          // "CARID": "车牌号码",
          // "卡号": "卡号",
          // "卡片类型": "卡片类型",
          // "工本费(元)": "工本费(元)",
          // "余额(元)": "余额(元)",
          // "开始时间": "开始时间",
          // "截止时间": "截止时间",
          // "注册时间": "注册时间",
          // "发卡部门": "发卡部门",
          // "USERID": "申请人ID",
          // "USERNAME": "申请人姓名",
          // "TYPE": "类型",
          // "CREATETIME": "创建时间",
          // "REASON": "访问原因",
          // "PASSDATE": "访问时间",
          // "DATA7": "旧车牌",
          // "DATA3": "车牌颜色",
          // "DATA4": "车辆颜色",
          // "DATA5": "车辆品牌",
          // "DATA6": "手机号码",
          // "operate": "操作",
          // "SP_USERID": "一级审批人ID",
          // "SP_USERNAME": "一级审批人姓名",
          // "DATA1": "二级审批人",
          // "DATA2": "三级审批人",
          // "DATA8": "是否外包",
        };
        let titleStr = '车牌号码	卡号	卡片类型	工本费(元)	余额(元)'
          + '	开始时间	截止时间	注册时间	发卡部门	卡片状态'
          + '	发卡人员	停车类型	车牌颜色	车辆类型	车牌类型'
          + '	车辆颜色	车辆品牌	车主姓名	手机号码	证件号码'
          + '	住址	职位	所属公司	所在部门	发卡器类型'
          + '	分组名称	场库权限	车卡分类	发动机号	排放量号'
          + '	识别代码	车架号	车辆排量	车队名称';

        titleStr.split('	').forEach(el => {
          titles[el] = el;
        });
        // titles['SP_USERID'] = '一级审批人ID';
        // titles['SP_USERNAME'] = '一级审批人姓名';
        // titles['DATA1'] = '二级审批人';
        // titles['DATA2'] = '三级审批人';
        // titles['DATA8'] = '是否外包';

        let exportOption = {
          titles,
          hideColumns: ['APPLY_ID',],
          header: [],
        };
        let filename = '申请记录.xls';
        // 如果type非空,用type筛选数据源
        let f_data = tableDatas.tableDatasAfterFilter;
        if (state) {
          f_data = f_data.filter(row => row.STATE == state);
        }
        f_data = JSON.parse(JSON.stringify(f_data));
        let now = dayjs();
        // 处理数据
        f_data = f_data.map(row => {
          let newRow = { ...titles };
          newRow['车牌号码'] = row['CARID'];
          newRow['开始时间'] = now.format('YYYY-MM-DD');
          newRow['截止时间'] = row['TYPE'] == 0 ? '2099-01-01' : (row['PASSDATE'] ? (dayjs(row['PASSDATE'].split(',')[1]).add(1, 'day').format('YYYY-MM-DD')) : '2099-01-01');
          newRow['注册时间'] = now.format('YYYY-MM-DD HH:mm:ss');

          newRow['停车类型'] = `固定车`;
          newRow['车牌颜色'] = row['DATA3'] + '色';
          newRow['车辆类型'] = `其它`;
          newRow['车牌类型'] = `无类型`;
          newRow['车辆颜色'] = row['DATA4'];
          newRow['车辆品牌'] = row['DATA5'];
          newRow['车主姓名'] = row['DATA10'] ? (row['DATA10'] + row['USERNAME']) : (row['USERID'] + row['USERNAME']);
          newRow['手机号码'] = row['DATA6'];
          newRow['场库权限'] = `1`;
          newRow['车卡分类'] = `系统默认`;
          // 遍历newRow
          for (const key in newRow) {
            if (newRow.hasOwnProperty(key)) {
              const value = newRow[key];
              if (key == value) {
                newRow[key] = '';
              }
            }
          }
          return newRow;
        });
        console.log('f_data :>> ', f_data);
        let exportArr = f_data;
        // 处理数组
        // for (let i = 0; i < exportArr.length; i++) {
        //   const el = exportArr[i];
        //   el.TYPE = el.TYPE == '0' ? '内部' : '外部';
        //   el.STATE = el.STATE == '-3' ? '已删除' : el.STATE == '-2' ? '申请删除' : el.STATE == '-1' ? '审批未通过' : el.STATE == '0' ? '未审批' : el.STATE == '1' ? '一级审批通过' : el.STATE == '2' ? '二级审批通过' : el.STATE == '3' ? '三级审批通过' : '已录入';
        // }
        let exportOption2 = {
          titles: {
            '分组名称': '分组名称',
            '分组车位数': '分组车位数',
          },
          hideColumns: [],
          header: [],
        };
        xlsx.exportMultipleDatas([exportArr, []], [exportOption, exportOption2], filename, ['车卡资料', '车位分组']);
      },
    });

    let sendTaskcard = function (workIds, url, title, description) {
      if (url) {
        myAxios.postToWeChat(workIds, title, description, url);
      }
      else {
        myAxios.postToWeChat(workIds, '审批申请', '您有新的车辆审批申请,点击前往(工作台->驱动DS->通用专区->车辆登记->车辆审批)', window.location.href);
        // myAxios.postToWeChat('14602', '审批申请', '您有新的车辆审批申请,点击前往', window.location.origin + window.location.pathname + url.href);
      }
    };

    setTimeout(() => {
      const url = router.resolve({
        path: '/insideApply/checkCars',
      });
      // sendTaskcard('14602');
    }, 1000);

    return {
      activeName,
      loading,
      addBtnClick,
      dialogDatas,
      tableDatas
    };
  }
}
</script>
<style lang="css" scope>
.marginTop10 {
  margin-top: 10px;
}
</style>

